parasails.registerPage('patch-progress', {
  //  ╦╔╗╔╦╔╦╗╦╔═╗╦    ╔═╗╔╦╗╔═╗╔╦╗╔═╗
  //  ║║║║║ ║ ║╠═╣║    ╚═╗ ║ ╠═╣ ║ ║╣
  //  ╩╝╚╝╩ ╩ ╩╩ ╩╩═╝  ╚═╝ ╩ ╩ ╩ ╩ ╚═╝
  data: {
    modal: '',
    availableOperatingSystems: [],
    cloudError: '',
    syncingMessage: '',
    syncing: false,
    formData: {},
    formErrors: {},
    formRules: {},
    patchProgressForSelectedTeam: {},
    teamApid: undefined,
    selectedTeamDisplayName: 'All teams',
    // For showing host count for each complaint version.
    compliantVersionInfo: {},
    // For prfilling form data
    currentComplaintVersionIds: {},
    // For the <select> options
    versionsUsedByEntireOrg: {},
    expandedPatchProgress: undefined,
    showCompliantOperatingSystems: false,
    showCompliantChromeVersions: false,
    showCompliantSafariVersions: false,
    showCompliantFirefoxVersions: false,
    showCompliantMicrosoftOfficeVersions: false,
    showCompliantFlashVersions: false,
    exportTypeFriendlyNames: {
      'chrome': 'Google Chrome',
      'operatingSystem': 'operating system',
      'safari': 'Safari',
      'firefox': 'Mozilla Firefox',
      'flash': 'Flash',
      'microsoftOffice': 'Microsoft Office'
    }
  },

  //  ╦  ╦╔═╗╔═╗╔═╗╦ ╦╔═╗╦  ╔═╗
  //  ║  ║╠╣ ║╣ ║  ╚╦╝║  ║  ║╣
  //  ╩═╝╩╚  ╚═╝╚═╝ ╩ ╚═╝╩═╝╚═╝
  beforeMount: function() {
    //…
  },
  mounted: async function() {
    this.availableOperatingSystems = _.clone(this.operatingSystemsInUse);
    // Prefill the compliant versions form
    this.currentComplaintVersionIds = _.clone(this.idsOfCompliantVersions);
    this.compliantVersionInfo = _.clone(this.complaintVersionsInUse);
    this.versionsUsedByEntireOrg = _.clone(this.versionsInUse);
    this.patchProgressForEntireOrg = _.clone(this.patchProgress);
  },

  //  ╦╔╗╔╔╦╗╔═╗╦═╗╔═╗╔═╗╔╦╗╦╔═╗╔╗╔╔═╗
  //  ║║║║ ║ ║╣ ╠╦╝╠═╣║   ║ ║║ ║║║║╚═╗
  //  ╩╝╚╝ ╩ ╚═╝╩╚═╩ ╩╚═╝ ╩ ╩╚═╝╝╚╝╚═╝
  methods: {
    clickOpenEditModal: function(modalName) {
      this.modal = modalName;
      this.formData = _.clone(this.currentComplaintVersionIds);
    },
    clickOpenExportModal: function(exportType) {
      this.formData = {
        exportType: exportType,
        teamApid: this.teamApid,
      };
      this.modal = 'export';
    },
    clickCloseModal: async function () {
      this.syncing = false;
      this.formData = {};
      this.modal = '';
    },
    handleSubmittingExportForm: async function(argins) {
      this.syncing = true;
      this.syncingMessage = 'Generating your CSV export... \n\n This process may take up to 20 minutes.';
      // create a copy of the formData to prevent changing the "Team" dropdown if we need to set teamApid to undefined.
      let exportArgins = _.clone(argins);
      if(exportArgins.teamApid === 'undefined'){
        exportArgins.teamApid = undefined;
      }
      io.socket.get('/download-unpatched-hosts-csv', exportArgins, ()=>{});
      io.socket.on('csvExportDone', this._handleExportFormResult);

    },
    _handleExportFormResult: async function(csv) {
      let exportFilename = `export ${new Date().toISOString()}.csv`;
      let csvExportUrl = URL.createObjectURL(new Blob([csv], { type: 'text/csv;' }));
      let exportDownloadLink = document.createElement('a');
      exportDownloadLink.href = csvExportUrl;
      exportDownloadLink.download = exportFilename;
      exportDownloadLink.click();
      URL.revokeObjectURL(csvExportUrl);
      this.syncingMessage = '';
      this.syncing = false;
      this.modal = '';
      await this.forceRender();
      // Disable the socket event listener after we start the download, We do this for
      // the download actions because if this event listener is left active, any subsequent exports will download multiple times.
      io.socket.off('csvExportDone', this._handleExportFormResult);
    },

    handleSubmittingOperatingSystemsForm: async function(argins) {
      this.syncingMessage = 'Updating compliant operating systems...';
      this.syncing = true;
      await Cloud.setCompliantVersions.with({complianceType: 'operatingSystem', compliantVersions:  argins.operatingSystem});
      this.currentComplaintVersionIds.operatingSystem = _.uniq(argins.operatingSystem, (versionId)=>{
        return Number(versionId);
      });
      let newPatchProgressInfo = await Cloud.getPatchProgressForASingleTeam.with({teamApid: this.teamApid});
      this.patchProgress = newPatchProgressInfo.patchProgressForThisTeam;
      this.compliantVersionInfo = _.clone(newPatchProgressInfo.complaintVersionsInUse);
      this.syncing = false;
      this.modal = '';
      await this.forceRender();
    },
    handleSubmittingBrowsersForm: async function(argins) {
      this.syncingMessage = 'Updating compliant browser versions...';
      this.syncing = true;
      if(argins.chrome !== this.currentComplaintVersionIds.chrome){
        await Cloud.setCompliantVersions.with({complianceType: 'chrome', compliantVersions:  argins.chrome});
      }
      if(argins.safari !== this.currentComplaintVersionIds.safari){
        await Cloud.setCompliantVersions.with({complianceType: 'safari', compliantVersions:  argins.safari});
      }
      if(argins.firefox !== this.currentComplaintVersionIds.firefox){
        await Cloud.setCompliantVersions.with({complianceType: 'firefox', compliantVersions:  argins.firefox});
      }
      let newPatchProgressInfo = await Cloud.getPatchProgressForASingleTeam.with({teamApid: this.teamApid});
      this.patchProgress = newPatchProgressInfo.patchProgressForThisTeam;
      this.compliantVersionInfo = _.clone(newPatchProgressInfo.complaintVersionsInUse);
      this.currentComplaintVersionIds.chrome = _.uniq(argins.chrome, (versionId)=>{
        return Number(versionId);
      });
      this.currentComplaintVersionIds.firefox = _.uniq(argins.firefox, (versionId)=>{
        return Number(versionId);
      });
      this.currentComplaintVersionIds.safari = _.uniq(argins.safari, (versionId)=>{
        return Number(versionId);
      });
      this.syncing = false;
      this.modal = '';
      await this.forceRender();
    },
    handleSubmittingOtherCriticalSoftwareForm: async function(argins) {
      this.syncingMessage = 'Updating compliant critical software versions...';
      this.syncing = true;
      if(argins.microsoftOffice !== this.currentComplaintVersionIds.microsoftOffice) {
        await Cloud.setCompliantVersions.with({complianceType: 'microsoftOffice', compliantVersions:  argins.microsoftOffice});
      }
      if(argins.flash !== this.currentComplaintVersionIds.flash){
        await Cloud.setCompliantVersions.with({complianceType: 'flash', compliantVersions:  argins.flash});
      }
      this.currentComplaintVersionIds.microsoftOffice = _.uniq(argins.microsoftOffice, (versionId)=>{
        return Number(versionId);
      });
      this.currentComplaintVersionIds.flash = _.uniq(argins.flash, (versionId)=>{
        return Number(versionId);
      });
      let newPatchProgressInfo = await Cloud.getPatchProgressForASingleTeam.with({teamApid: this.teamApid});
      this.patchProgress = newPatchProgressInfo.patchProgressForThisTeam;
      this.compliantVersionInfo = _.clone(newPatchProgressInfo.complaintVersionsInUse);
      this.syncing = false;
      this.modal = '';
      await this.forceRender();
    },
    changeFilteredTeam: async function() {
      if(this.teamApid === undefined) {
        this.selectedTeamDisplayName = 'All teams';
      } else {
        this.selectedTeamDisplayName = _.find(this.teamsToDisplay, {id: this.teamApid}).name;
      }
      this.syncing = true;
      this.syncingMessage = `Getting patch progress for ${this.selectedTeamDisplayName}...`;
      let newPatchProgressInfo = await Cloud.getPatchProgressForASingleTeam.with({teamApid: this.teamApid});
      this.patchProgress = newPatchProgressInfo.patchProgressForThisTeam;
      this.compliantVersionInfo = _.clone(newPatchProgressInfo.complaintVersionsInUse);
      await this.forceRender();
      this.syncing = false;
      return;
    },
    clickExpandPatchProgress: function(patchProgressToExpand) {
      this.expandedPatchProgress = patchProgressToExpand;
    },

  }
});
